<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>ng-class动态改变样式类 </title>
		<style>
		.red{
			background: red;
		}
		.green{
			background: green;
		}
		.yellow{
			color: yellow;
		}
		</style>
	</head>
	<body>
		<div ng-app = "hd" ng-controller = "ctrl">
			<p ng-class="{red:true}">测试文字</p>
			<table border="1" width="600">
				<tr>
					<td>名称</td>
					<td>年龄</td>
					<td>链接</td>
				</tr>
				<tr ng-repeat="v in data" ng-class-even="{red:true}" ng-class-odd="{green:true}">
					<td ng-class="{yellow:v.age>15}">{{v.name}}</td>
					<td>{{v.age}}</td>
					<td>{{v.url}}</td>
				</tr>
			</table>
		</div> 
		<script src="../org/angular.min.js" ></script>
		
		<script>
			var m = angular.module('hd',[]);
			m.controller('ctrl',['$scope',function($scope){
				$scope.data=[
				    {name:'百度',age:10,url:"www.baidu.com"},
				    {name:'京东',age:15,url:"www.jd.com"},
				    {name:'360',age:20,url:"www.360.com"},
				    {name:'苏宁',age:25,url:"www.suning.com"}
				];
			}]);
		</script>
	</body>
</html>
